<template>
	<view>
		<div class="download">
		<!-- 	<div class="top">
				<span><</span>

						<image src="@/static/more.png"></image>
			</div> -->
			<div class="middle">
				<div class="logo">
					<image src="@/static/logo.png"></image>
				</div>
<!-- 				<h3>有吉</h3>
				<h6>为耕者谋利 为食者造福</h6> -->
			</div>
			<div class="btn" @tap="downpath">
				<div>
					<image src="@/static/an.png"></image>
					立即下载
				</div>
			</div>
			<div class="tip">
				<div>
					若此页面无法下载可去
					<br />
					浏览器打开页面下载
				</div>
				<span>
				</span>
				<!-- <image src="../../../../imgs/3.jpg"></image> -->
			</div>
		</div>
	</view>
</template>



<script>



	export default {
		data() {
			return {
                path:"",
								version:'',
			}
		},
		onShow(){
			var _this = this;


			// http.get(`app/updatever`, httpData,{
			//      isPrompt: isPrompt
			//  }).then(res => {

			//      /* res的数据说明
			//       * | 参数名称        | 一定返回     | 类型        | 描述
			//       * | -------------|--------- | --------- | ------------- |
			//       * | versionCode     | y        | int       | 版本号        |
			//       * | versionName     | y        | String    | 版本名称      |
			//       * | versionInfo     | y        | String    | 版本信息      |
			//       * | updateType      | y        | String    | forcibly = 强制更新, solicit = 弹窗确认更新, silent = 静默更新 |
			//       * | downloadUrl     | y        | String    | 版本下载链接（IOS安装包更新请放跳转store应用商店链接,安卓apk和wgt文件放文件下载链接）  |
			//       */



			//      if (res && res.data.downloadUrl) {
			//          // 兼容之前的版本（updateType是新版才有的参数）
			//          if(res.data.updateType){
			//              callback && callback(res.data);
			//          } else {
			//              if(res.data.forceUpdate){
			//                  res.data.updateType = "forcibly";
			//              } else {
			//                  res.data.updateType = "solicit";
			//              }
			//              callback && callback(res.data);
			//          }
			//      } else if (isPrompt) {
			//          uni.showToast({
			//              title: "暂无新版本",
			//              icon: "none"
			//          });
			//      }
			//  })
			// 		.catch((e) => {

			// 		});

				 this.$http
							.get(`app/updatever`, {

							})
							.then(r => {
										this.path =  r.data.path
										this.version =  r.data.version

							})
							.catch(() => {

							});


		},
		methods: {
				 //导出事件
					downpath() {
            // #ifdef H5
              let link = document.createElement("a");
              //创建一个a标签
              link.style.display = "none";
              //将a标签隐藏
              link.href = this.path ;
              //给a标签添加下载链接  "域名+接口"  safe是一个动态的域名  后面的接口替换成你自己的下载接口
              link.setAttribute("download", this.version);
              // 此处注意，要给a标签添加一个download属性，属性值就是文件名称 否则下载出来的文件是没有属性的，空白白
              document.body.appendChild(link);
              //将上面创建的a标签加入到body的尾部
              link.click();
              //执行a标签
            // #endif

					}
		}
	}
</script>

<style scoped="scoped" lang="scss">
	.download {
		width: 100%;
		height: 100vh;
		background-image: url(@/static/download.png);
		background-repeat: no-repeat;
		// background-size: 100% auto;
		background-size: 100% 100%;
		display: flex;
		flex-direction: column;
		position: relative;

		.tip {
			position: absolute;
			right: 20px;
			top: 45px;
			background-color: #ffffff;
			font-size: 12px;
			width: 7.5rem;
			height: 2.5rem;
			text-align: center;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 5px;
			color: #f53746;

			span {
				display: inline-block;
				width: 0;
				height: 0;
				border: 8px solid transparent;
				border-top: none;
				border-bottom-color: #fff;
				position: absolute;
				right: 8px;
				top: -8px;
			}

		}

		.top {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 10px 20px;

			image {
				width: 35px;
				height: 35px;
			}

			span {
				// font-size: 30px;
				color: #fff;
			}
		}

		.middle {
			flex: 1;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-direction: column;
			color: #fff;

			.logo {
				width: 3.5rem;
				height: 4.5rem;

				// background-color: green;
				// border-radius: 50%;
				image {
					width: 100%;
					height: 100%;
				}
			}

			h3 {
				margin-top: 20px;
			}

			h6 {
				letter-spacing: 5px;
				margin-top: 3px;
			}
		}

		.btn {
			display: flex;
			align-items: center;
			justify-content: center;
			height: 30%;

			div {
				padding: 5px 20px;
				color: #fb4050;
				background-color: #fff;
				font-size: 0.8rem;
				border-radius: 20px;
				display: flex;
				align-items: center;
				justify-content: center;

				image {
					width: 25px;
					height: 25px;
					margin-right: 5px;
				}
			}
		}
	}
</style>
